<template>
	<div class="splash">
		<img :src="shareInfo.img_url_home" alt="" class="bg1" mode="widthFix" @tap="show" />
		<view class="skip flex align-center" @tap="navTo('/pages/index/index')">
			<view class="num">{{ second }}</view>
			<view>跳过</view>
		</view>

		<!-- <view class="btn"><u-button @click="show" shape="circle" type="success">逛花市</u-button></view> -->
	</div>
</template>

<script>
import { mapState, mapMutations } from 'vuex';
let timer = null;
export default {
	data() {
		return {
			second: 3
		};
	},

	created() {},
	onLoad(options) {
		let recommendId = '';
		if (options && options.recommendId) {
			recommendId = options.recommendId;
		}
		if (options && options.scene) {
			let scene = decodeURIComponent(options.scene);
			//&是我们定义的参数链接方式
			recommendId = scene && scene != 0 ? scene : '';
			//其他逻辑处理。。。。。
		}
		console.log('options', options);
		if (recommendId) {
			this.SET_INVITED(recommendId);
		}
		timer = setInterval(() => {
			if (this.second == 1) {
				this.navTo('/pages/index/index');
				return;
			}
			this.second--;
		}, 1e3);
	},
	computed: {
		...mapState(['shareInfo', 'pid'])
	},
	methods: {
		...mapMutations(['SET_INVITED']),
		show() {
			let path = this.shareInfo && this.shareInfo.path ? this.shareInfo.path : '/pages/index/index';
			this.navTo(path);
		},
		navTo(path) {
			clearInterval(timer);
			if (['/pages/index/index', '/pages/account/account', '/pages/classify/classify', '/pages/mine/mine', '/pages/car/car'].includes(path)) {
				this.$Router.pushTab({
					path
				});
			} else {
				this.$Router.replace({
					path
				});
			}
		}
	}
};
</script>

<style lang="scss">
/* .uni-page-body{
		height: 100%;
	} */
$bgcolor: #fb753b;

.splash {
	position: relative;
	height: 100%;
	line-height: 1.8;
	box-sizing: border-box;
	overflow: hidden;
}

.bg1 {
	height: 100vh;
	width: 100vw;
	position: absolute;
	bottom: 0;
}

.skip {
	position: absolute;
	bottom: 50px;
	right: 20px;
	background: rgba(0, 0, 0, 0.3);
	color: #fff;
	border-radius: 30upx;
	padding: 0 20upx 0 0;
	font-size: 28upx;
	.num {
		height: 50upx;
		width: 50upx;
		line-height: 50upx;
		text-align: center;
		background: rgba(0, 0, 0, 0.3);
		border-radius: 25upx;
		display: block;
		margin-right: 10upx;
	}
}
</style>
